<template>
  <div class="hello">
    <light-timeline :items='items'>
        <template slot='tag' slot-scope='{ item }'>
            {{item.tag}}
        </template>
        <template slot='type' slot-scope='{ item }'>
            {{item.type}}
        </template>
        <template slot='content' slot-scope='{ item }'>
            {{item.content}}
        </template>
    </light-timeline>
  </div>
</template>

<script>
export default {
  name: 'slotTime',
  data () {
    return {
      items: [
       {
          tag: 'Sunday',
          type: 'circle',
          color: 'yellow',
          content: '1111111'
        },
        {
          tag: 'Monday',
          type: 'star',
          color: 'orange',
          content: '1111111'
        },
        {
          tag: 'Tueday',
          type: 'circle',
          color: 'blue',
          content: '2222222'
        },
        {
          tag: 'Wednesday',
          type: 'star',
          color: 'blue',
          content: '2222222'
        },
        {
          tag: 'Thursday',
          type: 'circle',
          color: 'green',
          content: '2222222'
        },
        {
          tag: 'Friday',
          type: 'star',
          color: 'orange',
          content: '3333333'
        },
        {
          tag: 'Saturday',
          type: 'circle',
          color: 'yellow',
          content: '3333333'
        },
      ]
    }
  }
}
</script>

<style scoped lang="scss">

</style>
